<!--
  Generated template for the OpenWorkPage page.

  See http://ionicframework.com/docs/components/#navigation for more info on
  Ionic pages and navigation.
-->
<ion-header no-border>

    <ion-navbar [ngClass]="{'theme_pink':_theme == 'theme_pink','theme_dark':_theme == 'theme_dark','theme_red':_theme == 'theme_red','theme_yellow':_theme == 'theme_yellow','theme_green':_theme == 'theme_green','theme_blue':_theme == 'theme_blue','theme_purple':_theme == 'theme_purple'}">
        <ion-title>{{_data.title}}</ion-title>
        <ion-buttons end>
            <button ion-button icon-only (click)="presentPopover($event);">
                <ion-icon name="more"></ion-icon>
            </button>
        </ion-buttons>
    </ion-navbar>

</ion-header>


<ion-content>
    <section class="work_banner" [style.background]="'url('+_data.banner+')'"></section>

    <header>
        <img class="userimg" [src]="_data.userimg" />
        <div class="base">
            <h6>{{_data.uname}}</h6>
            <p>{{_data.time | date}}</p>
        </div>
        <div class="other">
            <div class="btn">关注</div>
        </div>
    </header>

    <section class="content_wrap">
        <h5>{{_data.title}}</h5>
        <p class="dec">{{_data.text}}</p>


        <div class="foods">
            <h4>用料：</h4>

            <ion-row *ngFor="let food of _data.food">
                <ion-col>
                    <div>{{food.name}}</div>
                </ion-col>
                <ion-col>
                    <div>{{food.len}}</div>
                </ion-col>
            </ion-row>

        </div>

        <div class="step">
            <h4>步骤：</h4>

            <ion-card *ngFor="let work of _data.work">
                <img [src]="work.src" />
                <ion-card-content>

                    <p>{{work.text}}</p>
                </ion-card-content>
            </ion-card>

        </div>

        <div class="tip" *ngIf="_data.tip != ''">
            <h4>提示：</h4>
            <p>{{_data.tip}}</p>
        </div>

    </section>


</ion-content>